<template>
  <Form ref="info" :model="form" :rules="rule" :label-width="100">
    <FormItem v-if="!!username" :label="$t('CgvrhWPTyNdWuKL0t5z6A')">
      <Input v-model="username" disabled />
    </FormItem>
    <FormItem :label="$t('Zj4S4RGhvLZuqafNEyShI')" prop="password">
      <Input type="password" v-model="form.password" :placeholder="$t('ZL2yCzoou29fpPfDmkv4U')"></Input>
    </FormItem>
    <FormItem :label="$t('eNj5BTPGzPZ5TpL7Oj5bb')" prop="newPassword">
      <Input type="password" v-model="form.newPassword" :placeholder="$t('_SrIGU1qF5RfxHBnwC1YB')"></Input>
    </FormItem>
    <FormItem :label="$t('jUXYDN8QK2eQkLwAuIiA1')" prop="confirmPassword">
      <Input type="password" v-model="form.confirmPassword" :placeholder="$t('rGPPRiLHwyIzGaKu1FdDf')"></Input>
    </FormItem>
    <FormItem>
      <Button type="primary" @click="save">{{$t('y_dkHscGXpx-UeEt7GF-H')}}</Button>
    </FormItem>
  </Form>
</template>

<script>
import { usermodifypwd } from '@/api/data2'

export default {
  name: 'password-form',
  props: {
    username: String
  },
  data () {
    return {
      form: {
        password: '',
        newPassword: '',
        confirmPassword: ''
      },
      rule: {
        password: [
          { required: true, message: this.$t('Sv9LW9Du9jAyARcc0xUFM'), trigger: 'blur' }
        ],
        newPassword: [
          { required: true, message: this.$t('cg3hSoKG7uDphtNY9aRHa'), trigger: 'blur' }
        ],
        confirmPassword: [
          { required: true, message: this.$t('JiSqRGq6-xj9NGTxvqdMn'), trigger: 'blur' },
          {
            required: true,
            trigger: 'blur',
            validator: (rule, value) => {
              console.log('=========== confirmPassword ========== ')
              console.log(rule, value)
              return value === this.form.newPassword
            },
            message: this.$t('zwaEc0B1KThYW-uhxi8gF')
          }
        ]
      }
    }
  },
  methods: {
    save () {
      this.$refs.info.validate(async valid => {
        if (valid) {
          const { code, data, desc } = await usermodifypwd({
            username: this.username || this.$store.state.user.userName,
            oldpwd: this.form.password,
            newpwd: this.form.newPassword
          })
          if (code == 200) {
            this.$Message.success(desc || this.$t('cvv4R6VwNvYIzztnDLsT4'))
            this.$emit('success', desc)
          } else {
            this.$Message.error(desc || this.$t('DRY3iOtHLZrEKQnjZzE5o'))
            this.$emit('fail', desc)
          }
        } else {
          this.$Message.error(this.$t('fcmS3YBVNyvO3V68Qt3xl'))
        }
      })
    }
  }
}
</script>

<style>

</style>
